<template>
    <view @click="gotoPage()">
        <slot></slot>
    </view>
</template>

<script>
    const navType={
        push:'push',
        replace:'replace',
        replaceAll:'replaceAll',
        pushTab:'pushTab'
    }
    export default {
        props: {
            to: {
                type: String,
                default: '',
            },
            stopNavto:{
                type: Boolean,
                default: false,
            },
            navType: {
                type: String,
                default: 'push',
            },
            level:{
                type: Number,
                default: 1,
            },
            append: {
                type: Boolean,
                default: false,
            }
        },
        methods: {
            formatNav(text){
                text=text.replace(/\'/g,'');
                text=text.replace(/(\w+)(?=:)/g,function(val){
                    return `"${val}"`
                })
                text=text.replace(/:\s*([^,{}\s"]+)/g,function(val){
                    const arr=val.split(':');
                    return `:"${arr[1].trim()}"`
                })
                try{
                    text= JSON.parse(text);
                }catch(e){};

                if(this.append){
                    let pathArr=this.$Route.path.split('/');
                    pathArr.splice(pathArr.length-this.level,this.level);
                    pathArr=pathArr.join('/');
                    if(text.constructor===Object){
                        if(text.path){
                            text.path=pathArr+text.path;
                        }
                    }else{
                        text=pathArr+text
                    }
                }
                return text

            },
            gotoPage() {
                if(this.stopNavto){
                    return true;
                }
                const type=navType[this.navType];
                if(type==null){
                    return console.error(` "navType" unknown type \n\n value：${Object.values(navType).join('、')}`)
                }
                const navInfo=this.formatNav(this.to);

                this.$Router[type](navInfo);
            }
        }
    }
</script>

<style>
</style>
